<template>
	<view class='menu-cont'>
    <view class="menu-list">
        <block v-for="(item, index) in list" :key="index">
            <view class="item" @click="onGoColumn(item.url)">
                <image :src="item.icon" />
                <text>{{item.name}}</text>
            </view>
        </block>
    </view>
</view>
</template>

<script>
	export default {
		data() {
			return {
				list: [
					{
						icon: '/static/huiyuan1.png',
						name: '会员中心',
						url: '/pages/Column/Vip/Vip'
					},{
						icon: '/static/gonglue.png',
						name: '获券攻略',
						url: '/pages/Column/Strategy/Strategy'
					},{
						icon: '/static/renzheng.png',
						name: '认证中心',
						url: '/pages/Column/Attestation/Attestation'
					},
				]
			};
		}, 
		methods: {
			onGoColumn(url) {
				uni.navigateTo({ url })
			}
		}
	}
</script>

<style lang="scss">
.menu-cont {
  padding: 0 40upx;
  margin-bottom: 30upx;
}

.menu-list {
  display: flex;
  justify-content: space-around;
}

.item {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.item > image {
  width: 88upx;
  height: 88upx;
  margin-bottom: 10upx;
  filter: drop-shadow(0 4upx 6upx rgba(#49CD82,.3))
}

.item > text {
  font-size: 24upx;
  color: #666;
}
</style>
